<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="renderer" content="webkit" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>聚衣商城</title>
  <link rel="stylesheet" href="../../lib/css/reset.min.css">
  <link rel="stylesheet" href="../../css/all.min.css">
</head>

<body>

  <div class="app-wrap" v-cloak id="shopcart_pay">
     <span v-html="payHTML" v-if="payHTML"></span>
    <header-top></header-top>
    <div class="shopCart_logo">
      <a href="#"></a>
    </div>
    <div class="bg-gray">
     <div class="content">
      <div class="order_detail">
        <div class="order_detail_top">
          <div class="order_detail_item">
              <p>订单提交成功，请尽快付款！订单号：{{orderPayNumber}}</p>
              <p class="info">提醒：请您在24小时内完成支付，否则订单会自动取消</p>
          </div>
          <div class="pay_num">应付金额：<span class="col_red">{{payAmount.toFixed(2)}}</span> 元</div>
          </div>
          <div class="order_detail_info">
            <div class="order_detail_main">
              <h4>收货人：</h4><p>{{address.userName}} {{address.userPhone}}</p>
            </div>
            <div class="order_detail_main">
              <h4>收货地址：</h4>
              <p>{{address.provinceName}}省 {{address.cityName}}市 {{address.districtName}} {{address.userAdress}}</p>
            </div>
            <div class="order_detail_main">
              <h4>商品名称：</h4>
              <p>{{productName}}</p>
            </div>
         </div>
       </div>
       <div class="payment">
          <!--<div v-bind:class="[{payment_item:true},{ischecked:istrue}]">-->
            <!--<span v-bind:class="[{checkbox:true},{ischecked:istrue}]"></span>-->
              <!--<i class="icon-yue"></i> 余额支付-->
              <!--<div class="right">-->
                <!--支付 <span class="col-red">{{payAmount.toFixed(2)}}</span> 元-->
              <!--</div>-->
          <!--</div>-->
           <div class="payment_item" :class="{ischecked:clickClass[0].isTrue}" @click="orderTypeClick(0)">
               <span :class="[{checkbox:true},{ischecked:clickClass[0].isTrue}]" ></span>
               <i class="icon-alipay"></i>支付宝支付
               <div class="right" v-if="clickClass[0].isTrue">
                   支付
                   <span class="col-red" >{{payAmount.toFixed(2)}}</span> 元
               </div>
           </div>
          <div class="payment_item" :class="{ischecked:clickClass[1].isTrue}"  @click="orderTypeClick(1)">
            <span :class="[{checkbox:true},{ischecked:clickClass[1].isTrue}]"></span>
                <i class="icon-wx"></i>微信支付
              <div class="right" v-if="clickClass[1].isTrue" >
                  支付
                 <span class="col-red">{{payAmount.toFixed(2)}}</span> 元
              </div>
          </div>

          <!--<div class="payment_item">-->
            <!--<span v-bind:class="[{checkbox:true}]"></span>-->
            <!--<i class="icon-online"></i>在线支付-->
          <!--</div>-->
          <!--<div class="pay_input_item">-->
            <!--<p>余额支付密码：</p>-->
           <!--<div class="input_group">-->
              <!--<input class="pay_input" type="text" id="pay_input">-->
             <!--<label for="pay_input">-->
                <!--<i class="icon-keyboard"></i>-->
             <!--</label>  -->
           <!--</div>-->
          <!--</div>-->
          <div class="pay_btn">
              <!-- -->
            <button class="pay_button" @click="payBtn" >
              立即支付
            </button>
          </div>
       </div>
     </div>
    </div>
      <!-- 页脚 -->
      <com-footer></com-footer>
  </div>
  <script src="../../lib/js/vue.js"></script>
  <script src="../../lib/js/axios.min.js"></script>
  <!-- mock 数据 打包发布的时候记得移除 -->
  <script src="../../lib/js/mock.js"></script>
  <script src="../../js/all.min.js"></script>
  <script>
    shopcart_pay();
  </script>
</body>

</html>